<template>
  <div class="detail-content">
    <div class="title">预估详情</div>
    <div class="user-desc">
      <img class="head" style="margin-right: 10px;"></img>
      <div class="desc">
        <div class="person-info" style="display: flex;">
          <div class="name">{{estimateCare.xm}} </div>
          <div class="type">
            <span style="margin: 0 5px;">/</span>
            <span>  管控等级：</span>
            <span class="level">{{estimateCare.gkdj}}</span>
          </div>
          
        </div>
        <div class="object" style="margin-top: 15px;">
          <span>人员类型：{{estimateCare.type == 1? '社戒社康' : '社会面'}}</span>                                                
          <span>证件号码：{{estimateCare.sfzh}}</span>
          <span>个案编号：202208291059</span>
          <span>负责社工：杜晓军</span>
        </div>
      </div>
    </div>
    <a-tabs default-active-key="1" @change="callback">
      <a-tab-pane key="1" tab="主诉问题及评估服务">
        <div class="title">社会支持网络分析</div>
        <div class="table1">
          <table class="table" width="100%" cellspacing="0" cellpadding="0" border="1">
            <tbody>
              <tr>
                <td class="label">社会生态系统及说明</td>
                <td>{{estimateMainQuestion.societyEcologicalExplain}}</td>
              </tr>
            </tbody>
          </table>
          <div class="title">案主表征及主诉问题/需求</div>
          <table class="table" width="100%" cellspacing="0" cellpadding="0" border="1">
            <tbody>
              <tr>
                <td class="label"> (一) 案主目前对吸食毒品的态度/看法</td>
                <td>{{estimateMainQuestion.attitude}}</td>
              </tr>
              <tr>
                <td class="label">（二）案主曾做过的努力和成功经验</td>
                <td>{{estimateMainQuestion.successExperience}}</td>
              </tr>
              <tr>
                <td class="label">（三）是否呈现需要及时处理的问题</td>
                <td>{{getEstimateKeywordListStr(1)}}</td>
              </tr>
              <tr>
                <td class="label">（四）案主主诉问题或需求</td>
                <td>{{estimateMainQuestion.question}}</td>
              </tr>
            </tbody>
          </table>
          <div class="title">评估服务需要</div>
          <table class="table" width="100%" cellspacing="0" cellpadding="0" border="1">
            <tbody>
              <tr>
                <td style="min-width: 20%;" class="label">生理脱毒（毒品相关）情况</td>
                <td style="min-width: 20%;">{{getEstimateKeywordListStr(2)}}</td>
                <td style="min-width: 20%;" class="label">身心康复情况</td>
                <td style="min-width: 20%;">{{getEstimateKeywordListStr(3)}}</td>
                <td style="min-width: 20%;" class="label">行为表现情况</td>
                <td style="min-width: 20%;">{{getEstimateKeywordListStr(4)}}</td>
                <!-- <td></td> -->
              </tr>
              <tr>
                <td class="label">社会环境与适应能力</td>
                <td colSpan="2">{{getEstimateKeywordListStr(5)}}</td>
                <td class="label">危机性问题处理能力</td>
                <td colSpan="2">{{getEstimateKeywordListStr(6)}}</td>
              </tr>
              <tr>
                <td class="label">其他需要说明的事项</td>
                <td colSpan="5">{{estimateMainQuestion.otherExplain}}</td>
              </tr>
            </tbody>
          </table>
          <div class="title">社工意见</div>
          <table class="table" width="100%" cellspacing="0" cellpadding="0" border="1">
            <tbody>
              <tr>
                <td class="label">是否跟进</td>
                <td  v-if="estimateMainQuestion.isFollow">{{estimateMainQuestion.isFollow === 1 ? '是' : `否，${estimateMainQuestion.reasonFollow}`}}</td>
                <td v-else></td>
                <td class="label">是否紧急</td>
                <td  v-if="estimateMainQuestion.isUrgency">{{estimateMainQuestion.isUrgency === 1 ? '是' : `否，${estimateMainQuestion.reasonUrgency}`}}</td>
                <td v-else></td>
              </tr>
            </tbody>
          </table>
          <div class="title">督导意见</div>
          <table class="table" width="100%" cellspacing="0" cellpadding="0" border="1">
            <tbody>
              <tr>
                <td class="label">建议跟进重点及注意事项</td>
                <td>{{estimateMainQuestion.supervisorOpinion}}</td>
              </tr>
            </tbody>
          </table>
        </div>
        
      
      </a-tab-pane>
      <a-tab-pane key="2" tab="平安关爱摸底" force-render>
        <div class="title">基本信息</div>
        <table class="table" width="100%" cellspacing="0" cellpadding="0" border="1">
          <tbody>
            <tr>
              <td class="label">姓名</td>
              <td>{{estimateCare.xm}}</td>
              <td class="label">性别</td>
              <td>{{estimateCare.xb}}</td>
              <td class="label">身份证号</td>
              <td>{{estimateCare.sfzh}}</td>
            </tr>
            <tr>
              <td class="label">户籍地</td>
              <td>{{estimateCare.hjdz}}</td>
              <td class="label">居住地</td>
              <td>{{estimateCare.jzdz}}</td>
              <td class="label">当前管控状态</td>
              <td>{{estimateCare.gkzt}}</td>
            </tr>
            <tr>
              <td class="label">末次查处吸食毒品种类</td>
              <td>{{estimateCare.dpzl}}</td>
              <td class="label">社会面风险等级</td>
              <td>{{estimateCare.fxlb}}</td>
              <td class="label">是否定制“一人一策”</td>
              <td>{{estimateCare.yrya}}</td>
            </tr>
            <tr>
              <td class="label">就业类型</td>
              <td>{{estimateCare.jylx}}</td>
              <td class="label">本人月经济收入(元)</td>
              <td>{{estimateCare.income}}</td>
              <td class="label">家庭月经济收入(元)</td>
              <td>{{estimateCare.familyIncome}}</td>
            </tr>
          </tbody>
        </table>
        <div class="title">帮扶情况</div>
        
        <div class="sub-title">1、就业安置</div>
        <table class="table" width="100%" cellspacing="0" cellpadding="0" border="1">
          <tbody>
            <tr>
              <td class="label">是否享受需要就业安置</td>
              <td v-if="estimateCare.isPlacement">{{estimateCare.isPlacement == 1 ? '是' : '否'}}</td>
              <td v-else></td>
              <td class="label">接受就业培训次数</td>
              <td>{{estimateCare.acceptTrainNum}}</td>
              <td class="label">介绍就业次数</td>
              <td>{{estimateCare.introduceNum}}</td>
            </tr>
            <tr>
              <td class="label">就业存在困难</td>
              <td colspan="5">{{estimateCare.employmentDifficult}}</td>
            </tr>
          </tbody>
        </table>
        <div class="sub-title">2、落实低保</div>
        <table class="table" width="100%" cellspacing="0" cellpadding="0" border="1">
          <tbody>
            <tr>
              <td class="label">是否享受低保</td>
              <td v-if="estimateCare.isLow">{{estimateCare.isLow == 1 ? '是' : '否'}}</td>
              <td v-else></td>
              <td class="label">无法纳入低保原因</td>
              <td>{{estimateCare.noLowReason}}</td>
            </tr>
          </tbody>
        </table>
        <div class="sub-title">3、落实医保</div>
        <table class="table" width="100%" cellspacing="0" cellpadding="0" border="1">
          <tbody>
            <tr>
              <td class="label">是否享受医保</td>
              <td v-if="estimateCare.isMedical">{{estimateCare.isMedical == 1 ? '是' : '否'}}</td>
              <td v-else></td>
              <td class="label">无法纳入医保原因</td>
              <td>{{estimateCare.noMedicalReason}}</td>
            </tr>
          </tbody>
        </table>
        <div class="sub-title">4、解决子女上学</div>
        <table class="table" width="100%" cellspacing="0" cellpadding="0" border="1">
          <tbody>
            <tr>
              <td class="label">是否有未成年子女</td>
              <td  v-if="estimateCare.isChildren">{{estimateCare.isChildren == 1 ? '是' : '否'}}</td>
              <td v-else></td>
              <td class="label">是否解决上学困难问题</td>
              <td  v-if="estimateCare.isSchoolDifficult">{{estimateCare.isSchoolDifficult == 1 ? '是' : '否'}}</td>
              <td v-else></td>
              <td class="label">无法解决上学原因</td>
              <td>{{estimateCare.noSchoolReason}}</td>
            </tr>
          </tbody>
        </table>
        <div class="sub-title">5、赡养父母</div>
        <table class="table" width="100%" cellspacing="0" cellpadding="0" border="1">
          <tbody>
            <tr>
              <td class="label">是否存在赡养父母困难</td>
              <td v-if="estimateCare.isParentDifficult">{{estimateCare.isParentDifficult == 1 ? '是' : '否'}}</td>
              <td v-else></td>
              <td class="label">赡养父母困难原因</td>
              <td>{{estimateCare.parentReason}}</td>
            </tr>
          </tbody>
        </table>
        <div class="sub-title">6、心理辅导</div>
        <table class="table" width="100%" cellspacing="0" cellpadding="0" border="1">
          <tbody>
            <tr>
              <td class="label">是否需要并接受心理辅导</td>
              <td v-if="estimateCare.isGuidance">{{estimateCare.isGuidance == 1 ? '是' : '否'}}</td>
              <td v-else></td>
              <td class="label">接受心理辅导次数</td>
              <td>{{estimateCare.acceptGuidanceNum}}</td>
              <td class="label">未提供心理辅导原因</td>
              <td>{{estimateCare.noGuidanceReason}}</td>
            </tr>
          </tbody>
        </table>
        <div class="sub-title">7、住房问题</div>
        <table class="table" width="100%" cellspacing="0" cellpadding="0" border="1">
          <tbody>
            <tr>
              <td class="label">是否需要并解决住房问题</td>
              <td v-if="estimateCare.isSolveHousing">{{estimateCare.isSolveHousing == 1 ? '是' : '否'}}</td>
              <td v-else></td>
              <td class="label">解决方式</td>
              <td>{{estimateCare.solveWayHousing}}</td>
              <td class="label">未解决住房问题原因</td>
              <td>{{estimateCare.noHousingReason}}</td>
            </tr>
          </tbody>
        </table>
        <div class="sub-title">8、法律援助</div>
        <table class="table" width="100%" cellspacing="0" cellpadding="0" border="1">
          <tbody>
            <tr>
              <td class="label">是否存在法律纠纷</td>
              <td v-if="estimateCare.isDispute">{{estimateCare.isDispute == 1 ? '是' : '否'}}</td>
              <td v-else></td>
              <td class="label">解决方式</td>
              <td v-if="estimateCare.solveWayDispute">{{estimateCare.solveWayDispute == 1 ? '经济纠纷' : '其他民事纠纷'}}</td>
              <td v-else></td>
              <td class="label">未解决原因</td>
              <td>{{estimateCare.nreasonDispute}}</td>
            </tr>
          </tbody>
        </table>
        <div class="sub-title">9、慰问帮扶</div>
        <table class="table" width="100%" cellspacing="0" cellpadding="0" border="1">
          <tbody>
            <tr>
              <td class="label">是否接受过慰问帮扶</td>
              <td v-if="estimateCare.isHelp">{{estimateCare.isHelp == 1 ? '是' : '否'}}</td>
              <td v-else></td>
              <td class="label">接受次数</td>
              <td>{{estimateCare.acceptNumHelp}}</td>
              <td class="label">存在困难</td>
              <td>{{estimateCare.difficultHelp}}</td>
            </tr>
          </tbody>
        </table>
        <div class="sub-title">10、其他问题</div>
        <table class="table" width="100%" cellspacing="0" cellpadding="0" border="1">
          <tbody>
            <tr>
              <td class="label">问题内容</td>
              <td>{{estimateCare.questionOther}}</td>
              <td class="label">未解决原因</td>
              <td>{{estimateCare.reasonOther}}</td>
            </tr>
          </tbody>
        </table>
      </a-tab-pane>
    </a-tabs>
  </div>
</template>

<script>
  import {
    estimateDetails
  } from '@/api/sjsk/estimate/list/index.js'
  export default {
    data() {
      return {
        estimateCare: {},
        estimateKeywordList: {},
        estimateMainQuestion: {},
        
      }
    },
    created() {
      const {
        sjskPersonId,
        personType
      } = this.$route.query
      this.getDetail(sjskPersonId, personType)
    },
    methods: {
      getDetail(sjskPersonId, personType) {
        estimateDetails({sjskPersonId, personType}).then(res => {
          const {
            success,
            result
          } = res
          if (success) {
            this.estimateCare = result.estimateCare || {}
            this.estimateKeywordList = result.estimateKeywordList
            this.estimateMainQuestion = result.estimateMainQuestion || {}
          }
        })
      },
      getEstimateKeywordListStr(value) {
        let str = ''
        this.estimateKeywordList.map(item => {
          if(item.value == value) {
            const hasRemark = item.keyword.includes('其他') || item.keyword.includes('原因')
            hasRemark ? str += `${item.keyword}:${item.reamrk},` : str += `${item.keyword},`
          }
        })
        str.slice(0, str.length - 1)
        return str
      }
    }
  }
</script>

<style lang="less" scoped>
  .detail-content {
    background-color: #fff;
    padding: 20px;
    .object span{
      margin-right: 30px;
      margin-top: 15px;
    }
    .title {
      padding-bottom: 20px;
      border-bottom: 1px solid #ddd;
      font-size: 18px;
      font-weight: bold;
    }
    .sub-title{
      padding-bottom: 20px;
      font-weight: bold;
    }
    .user-desc {
      display: flex;
      margin: 20px 0;

      .head {
        width: 100px;
        height: 100px;
      }

      .desc {}
    }
  
    .table{
      margin: 20px 0;
      
      .label{
        background-color: #eee;
        width: 220px!important;
        text-align: center;
      }
      td{
        padding: 12px;
        width: 200px;
      }
    }
    .table1{
      td{
        padding: 12px;
        width: unset;
      }
    }
    
  }
</style>
